<template>
  <div class='py-2 h-[60vh] flex flex-col'>
    <h2 class='text-lg text-zinc-900 dark:text-zinc-200 font-bold mb-2 px-1'>选择省份</h2>
    <ul class='overflow-y-scroll'>
      <li
        v-for='(item,index) in dataList'
        :key='index'
        @click='$emit("onItemClick",index)'
        class='text-lg text-zinc-900 dark:text-zinc-300 px-1 py-1.5 duration-100 active:bg-zinc-100'
      >{{item.name}}</li>
    </ul>
  </div>
</template>

<script setup>
defineProps({
  dataList:{
    type:Array,
    required:true
  }
})

// 所有的事件都进行手动注册
defineEmits(['onItemClick'])
</script>

<style lang='scss' scoped>

</style>
